<template>
  <div class="roleManage">
    <basic-container>
      <div>
        <m-s-search
          @searchClick="
            (v) => {
              (queryForm = v), getList();
            }
          "
          :list="userGroupConfigOption.column"
        >
        </m-s-search>
      </div>
      <avue-crud
        :option="userGroupConfigOption"
        :data="data"
        :table-loading="loading"
        :page.sync="page"
        @current-change="currentChange"
        @size-change="sizeChange"
        @selection-change="(v) => (selection = v)"
        ref="curd"
      >
        <template slot="menuLeft">
          <el-button
            size="small"
            type="primary"
            @click="
              addToTabsList('用户分组', { oid: -1 }, 'userGroupTemp', 'open')
            "
            >新增
          </el-button>
        </template>

        <template slot="menu" slot-scope="{ row }">
          <el-button
            type="text"
            @click="addToTabsList('用户分组', row, 'userGroupTemp', 'view')"
          >
            查看详情
          </el-button>
          <el-button
            type="text"
            @click="addToTabsList('用户分组', row, 'userGroupTemp', 'edit')"
          >
            修改
          </el-button>
          <el-button type="text" @click="delRow(row)"> 删除 </el-button>
        </template>
      </avue-crud>
      <ms-drawer
        @refresh="getList()"
        ref="md"
        :visible.sync="visible"
        :tab-list.sync="tabsList"
      ></ms-drawer>
    </basic-container>
  </div>
</template>

<script>
import commonJs from "@/util/commonJs";
import MSSearch from "@/DMDComponents/MSSearch.vue";

export default {
  name: "userGroup",
  mixins: [commonJs],
  inject: ["userGroupConfigOption"],
  components: { MSSearch },
  data() {
    return {
      typeList: [
        {
          oid: 0,
          name: "系统角色",
        },
        {
          oid: 1,
          name: "团队角色",
        },
      ],
    };
  },
  methods: {
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.getList();
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.getList();
    },
    // 删除
    delRow(data) {
      this.$confirm("是否删除？").then(() => {
        this.api.del({ id: data.pid }).then(() => {
          this.$message.success("删除成功");
          this.getList();
          this.selection = [];
        });
      });
    },
  },
};
</script>